<template>
    <div>
        <ul >
        <li v-for="item,index in getTopicList" :key="index">
          <a href="#">
            <img :src="item.scene_pic_url" alt="" />
          </a>
          <h3>{{ item.title }}</h3>
          <p class="van-ellipsis">{{ item.subtitle }}</p>
          <p >{{ item.price_info | geshi }}</p>
        </li>
      </ul>
      <van-pagination v-model="currentPage" :page-count="2" mode="simple" @change="pageChange"/>
      
    </div>
</template>

<script>
import {getTopicList} from "@/request/api"
export default {
    data () {
        return {
            getTopicList:[],
            currentPage: 1,
        }
    },
    created(){
        getTopicList({
            page:1,size:10
        }).then(res=>{
            this.getTopicList=res.data.data
            // console.log(this.getTopicList);
        })
    },
    methods:{
        pageChange(i){
            getTopicList({
                page:i,size:10
            }).then(res=>{
                this.getTopicList=res.data.data
            })
                
        }
    }
}
</script>
 
<style lang = "less" scoped>
    ul{
        li{
            width: 100%;
            margin-bottom: 15px;
            background-color: #fff;
            p{
                font-size: 16px;
                margin-bottom: 20px;
            }
        }
    }
    .van-pagination{
        padding-bottom: 60px;
    }
</style>